<template>
  <a-modal v-model="visible" title="选择打印设备" :maskClosable="false" centered :afterClose="afterClose" width="50%">
    <SelectedUser :list="selectedRows" />
    <PrintDeviceSelect :activityId="activityId" @change="printDeviceChange" />
    <template #footer>
      <Button @click="closeModel">取消</Button>
      <Button type="primary" @click="()=>submit()">仅打印</Button>
      <Button type="primary" @click="()=>submit(true)">打印并代签到</Button>
    </template>
  </a-modal>
</template>

<script>
import SelectedUser from '@/views/activity/components/selectUser/selectedUser.vue'
import {  Button } from "ant-design-vue";
import PrintDeviceSelect from './printDeviceSelect.vue'
import { printChestCardList } from '@/api/activity/activity.js'
export default {
  props: {
    // 活动ID
    activityId: {
      type: Number | String,
    },
    //选中的报名人员
    selectedRows: {
      type: Array,
    },
  },
  components: {
    SelectedUser,
    PrintDeviceSelect,
    Button
  },
  data() {
    return {
      visible: false,
      currentPrintDevice: undefined,
    }
  },
  methods: {
    openModel() {
      this.visible = true
    },
    closeModel() {
      this.visible = false
    },
    afterClose() {
      this.$emit('resetCheckedRows')
    },
    printDeviceChange(item){
      this.currentPrintDevice = item;
    },
    async submit(isSign=false) {
      if (!this.currentPrintDevice) return this.$message.warning('请选择打印设备')

      let ids = this.selectedRows.map((m) => m.id)
      await printChestCardList({
        ids,
        equipmentNumber: this.currentPrintDevice.printerNo,
        deviceId: this.currentPrintDevice.id,
        activityId: this.activityId,
        isSign
      })
      this.$message.success('打印成功')
      this.closeModel()
      this.$emit('ok')
    },
  },
}
</script>

<style></style>
